<body>
  <video id="player" controls></video>
  <input type="file" id="uploader" />
  <script src="/asset/ffmpeg.min.js"></script>
  <script>
    const { createFFmpeg, fetchFile } = FFmpeg;
    const ffmpeg = createFFmpeg({ corePath: '/asset/ffmpeg-core.js', log: true });
    const transcode = async ({ target: { files } }) => {
      let t1 = Date.now();
      const { name } = files[0];
      if (!ffmpeg.isLoaded()) await ffmpeg.load();

      ffmpeg.FS('writeFile', name, await fetchFile(files[0]));
      await ffmpeg.run('-i', name, 'output.mp4');
      const data = ffmpeg.FS('readFile', 'output.mp4');
      const video = document.getElementById('player');
      video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
      console.log(Date.now() - t1);
    };
    document.getElementById('uploader').addEventListener('change', transcode);
  </script>
</body>
